<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8" %>
<table id="role_table_cl" class="table table-bordered">
</table>
<table id="operator_table" class="table table-bordered">

</table>
<script type="text/javascript">
    $(function(){
        var table_role = $('#role_table_cl').datagrid({
            height: '48%',
            width:'100%',
            fullGrid:true,
            columnMenu: false,
            contextMenuH:false,
            fieldSortable:false,
            gridTitle : '角色管理',
            showToolbar: true,
            toolbarItem: 'refresh,|,del',
            toolbarCustom:function(){
                return '<button type="button" class="btn btn-blue" onclick="saveRole();" data-icon="plus"><i class="fa fa-plus"></i> 添加</button>';
            },
            filterThead:false,
            delPK: 'id',
            dataUrl: '/admin/role/roles',
            inlineEditMult:false,
            saveAll:false,
            addLocation: 'last',
            editUrl: '/admin/role/save',
            delUrl:'/admin/role/delete',
            delConfirm:true,
            delCallback:function (response){
                if (response.haveError) {
                    BJUI.alertmsg('error', response.errMsg, {
                        okCall: function () {
                            $('#role_table_cl').datagrid("refresh",true);
                        }
                    });
                } else {
                    BJUI.alertmsg('ok', response.data, {
                        okCall: function () {
                            $('#role_table_cl').datagrid("refresh",true);
                            $('#operator_table').datagrid("refresh",true);
                        }
                    });
                }
            },
            columns: [
                {
                    name: 'name',
                    label: '名称',
                    align: 'center'
                },{
                    name: 'remark',
                    label: '说明',
                    align: 'center'
                },{
                    render:operationRole,
                    label:'操作列'
                }
            ],
            local:"remote",
            paging: {pageSize:9, pageIndex:1},
//        paging:false,
            linenumberAll: true
        });

        var table_operator = $('#operator_table').datagrid({
            height: '48%',
            width:'100%',
            fullGrid:true,
            columnMenu: false,
            contextMenuH:false,
            fieldSortable:false,
            gridTitle : '管理员管理',
            showToolbar: true,
            toolbarItem: 'refresh',
            toolbarCustom:function(){
                return '<button type="button" class="btn btn-blue" onclick="saveOperator();" data-icon="plus"><i class="fa fa-plus"></i> 添加</button>';
            },
            filterThead:false,
            inlineEditMult: false,
            addLocation: 'last',
            saveAll:false,
            delPK: 'id',
            dataUrl: '/admin/operator/operators',
            editUrl: '/admin/operator/save?id={id}',
            delUrl:'/admin/operator/delete',
            delConfirm:true,
            delCallback:function (response){
                if (response.haveError) {
                    BJUI.alertmsg('error', response.errMsg, {
                        okCall: function () {
                            $('#operator_table').datagrid("refresh",true);
                        }
                    });
                } else {
                    BJUI.alertmsg('ok', response.data, {
                        okCall: function () {
                            $('#operator_table').datagrid("refresh",true);
                        }
                    });
                }
            },
            columns: [
                {
                    name: 'userName',
                    label: '管理员名称',
                    align: 'center'
                },{
                    render:roleName,
                    label: '权限名称',
                    align: 'center'
                },{
                    render:operatorStatusRender,
                    label: '状态',
                    align: 'center'
                },{
                    name: 'remark',
                    label: '说明',
                    align: 'center'
                },{
                    render:operatOperation,
                    label:'操作列'
                }
            ],
            local:"remote",
            paging: {pageSize:9, pageIndex:1},
            linenumberAll: true
        });
    });

    /**
     * 角色表格操作
     */
    function operationRole(value,data){
        var html = '<button type="button" class="btn-green" onclick="saveRole(\''+data.id+'\')">编辑</button>'
                + '<button type="button" class="btn-red" data-toggle="del.datagrid.tr">删除</button>'
                +'<button type="button" class="btn-red" onclick="authorize(\''+data.id+'\');">授权</button>';
        return html
    }

    /**
     * 添加角色
     */
    function saveRole(id){
        var url = "/admin/role/savePage";
        if(id!=""&&id!=null&&typeof (id) != "undefined" ){
            url = url + "?id="+id;
        }
        BJUI.dialog({
            id: 'save_role',
            url: url,
            title: '编辑',
            resizable: true,
            width: 475,
            height: 380,
            fresh:true
        });
    }

    /**
     * 授权
     * @param id
     */
    function authorize(id) {
        BJUI.dialog({
            id: 'authorize',
            url:"/admin/role/authorizePage/"+id,
            title: '添加',
            resizable: true,
            fresh:true,
            width: 440,
            height: 370
        });
    }

    <!-- 管理员表格函数 -->
    /**
     * 管理员显示角色列
     */
    function roleName(value,data){
        if(data.roleModel===null||data.roleModel === ""||typeof (data.roleModel) === "undefined"){
            return null;
        }
        return data.roleModel.name;
    }

    /**
     * 状态列返回函数
     */
    function operatorStatusRender(value, data) {
        if(data.auth != 1){//表示超级管理员
            if (data.status === 0) {//开状态
                return '<div data-status="1" data-val = "' + data.id + '" class="selectBtn" onclick="updateOperatorStatus(this);"><div class="openWord">开</div><div class="open1 select_01"><div class="open2 select_02"></div></div><div class="closeWord">关</div></div>';
            } else {
                return '<div data-status="0" data-val = "' + data.id + '" class="selectBtn" onclick="updateOperatorStatus(this);"><div class="openWord">开</div><div class="open1 select_01 close1"><div class="select_02"></div></div><div class="closeWord">关</div></div>';
            }
        }
    }

    /**
     * 管理员表格生成操作列
     */
    function operatOperation(value,data){
        var roleId = null;
        if(data.roleModel!==null&&data.roleModel !== ""&&typeof (data.roleModel) !== "undefined"){
            roleId = data.roleModel.id;
        }
        var html = '';
        if(data.auth !== 1){//超级管理员
            html +=  '<button type="button" class="btn-green" onclick="operatorAuthorize(\''+data.id+'\');">权限配置</button>'
            html += '<button type="button" class="btn-red" data-toggle="del.datagrid.tr">删除</button>';
            html += '<button type="button" class="btn-red" onclick="updatePwd(\''+data.id+'\');">设置密码</button>';
        }
        return html
    }
    
    function updateOperatorStatus(e) {
        var $this = $(e);
        var id = $this.data("val");
        var status = $this.data("status");
        if (id === null || id === "" || typeof (id) === "undefined" || status === null || status === "" || typeof (status) === "undefined") {
            BJUI.alertmsg('error', "参数错误，重新操作", {
                okCall: function () {
                    $('#operator_table').datagrid("refresh",true);
                }
            });
            return;
        }

        BJUI.ajax('doajax', {
            url: '/admin/operator/updateStatus',
            loadingmask: true,
            data: {"id": id, "status": status},
            callback: function (response, options) {
                if (response.haveError) {
                    BJUI.alertmsg('error', response.errMsg, {
                        okCall: function () {
                            $('#operator_table').datagrid("refresh",true);
                        }
                    });

                } else {
                    BJUI.alertmsg('ok', response.data, {
                        okCall: function () {
                            $('#operator_table').datagrid("refresh",true);
                        }
                    });
                }
            }
        });
    }
    
    /**
     * 添加管理员
     */
    function saveOperator(id) {
        var url = "/admin/operator/savePage";
        if(id !== ""&&id!==null&&typeof (id) !== "undefined" ){
            url = url + "?id="+id;
        }

        BJUI.dialog({
            id: 'add_operator',
            url: url,
            title: '添加',
            resizable: true,
            width: 850,
            height: 400,
            fresh:true
        });
    }

    /**
     * 管理员授权
     * @param id
     */
    function operatorAuthorize(id) {
        BJUI.dialog({
            id: 'authorize',
            url:"/admin/operator/addRolePage?id="+id,
            title: '权限设置',
            resizable: true,
            width: 850,
            height: 400,
            fresh:true
        });
    }

    /**
     * 修改页面
     */
    function updatePwd(id) {
        BJUI.dialog({
            id: 'changePwdPage',
            url:"/admin/operator/changePwdPage/"+id,
            title: '设置密码',
            resizable: true,
            width: 500,
            height: 300,
            fresh:true
        });
    }

</script>